/*  footer 页脚组件 的 样式  */

/*  页脚的背景  */
.footer-background{
	margin-top: 20px;			/*  盒子模型：外边距  上方  */
	background-color: #3c3c3c;	/*  背景样式：背景颜色  纯色  */
}

/*  页脚  */
.footer{
	padding: 20px 0px;			/*  盒子模型：填充物/内边距：上下20px 左右0px  */
	display: flex;				/*  弹性布局：界面呈现：弹性容器  */
	justify-content: space-between;	/*  弹性布局：设置元素在主轴上的对齐方式：两端对齐  */
	align-items: flex-start;	/*  弹性布局：设置元素在侧轴上的对齐方式：起始端对齐  */
}

/*  页脚的左侧部分、右侧部分  */
.footer-left,.footer-right{
	display: flex;				/*  弹性布局：界面呈现：弹性容器  */
}

/*  页脚左侧的列  */
.footer-left-column{
	margin-right: 40px ;		/*  盒子模型：外边距  右侧  */
}

/*  页脚的主标题  */
.footer-primary{
	font-size: 14px;		/*  文本样式：字体尺寸  */
	color: #c2c2c2;			/*  文本样式：字体颜色  */
	margin-bottom: 10px;	/*  盒子模型：外边距  下方  */
}

/*  页脚的副标题  */
.footer-secondary{
	font-size: 12px;		/*  文本样式：字体尺寸  */
	color: #c2c2c2;			/*  文本样式：字体颜色  */
	margin-bottom: 5px;	/*  盒子模型：外边距  下方  */
}

/*  页脚右侧的列  */
.footer-right-column{
	margin-left: 40px;		/*  盒子模型：外边距  左侧  */
}

/*  页脚右侧的标题文字  */
.footer-right-primary{
	font-size: 14px;		/*  文本样式：字体尺寸  */
	color: #c2c2c2;			/*  文本样式：字体颜色  */
	text-align: center;		/*  文本样式：水平对齐方式：居中对齐  */
}